<!-- eslint-disable vue/no-use-v-if-with-v-for -->
<!-- eslint-disable vue/valid-v-slot -->
<template>
  <div class="main-container">
    <TableBody>
      <template #header>
        <TableHeader ref="tableHeaderRef" :show-filter="false">
          <template #search-content>
            <a-form ref="serchForm" :model="form">
              <a-row :gutter="24">
                <a-col :span="4">
                  <a-form-item field="name" hide-label>
                    <a-input v-model="form.name" placeholder="请输入提现姓名" allow-clear />
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item field="accountNumber " hide-label>
                    <a-input
                      v-model="form.accountNumber"
                      placeholder="请输入提现账号"
                      allow-clear
                    />
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item field="type" hide-label>
                    <a-select v-model="form.type" placeholder="请选择提现途径" allow-clear>
                      <a-option :value="0">支付宝</a-option>
                      <a-option :value="1">微信</a-option>
                      <a-option :value="2">银行卡</a-option>
                    </a-select>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item field="state" hide-label>
                    <a-select
                      v-model="form.states"
                      multiple
                      :max-tag-count="1"
                      placeholder="请选择提现状态"
                      allow-clear
                    >
                      <a-option :value="0">等待审核</a-option>
                      <a-option :value="1">正在审核</a-option>
                      <a-option :value="2">审核通过</a-option>
                      <a-option :value="3">审核驳回</a-option>
                    </a-select>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item field="manual" hide-label>
                    <a-select v-model="form.manual" placeholder="请选择打款方式" allow-clear>
                      <a-option :value="1">手动处理</a-option>
                      <a-option :value="0">自动打款</a-option>
                    </a-select>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item field="addTime" hide-label>
                    <a-date-picker
                      v-model="form.addTime"
                      style="width: 100%"
                      show-time
                      placeholder="请选择开始提现时间"
                      :time-picker-props="{ defaultValue: '12:00:00' }"
                      format="YYYY-MM-DD HH:mm:ss"
                      allow-clear
                      :shortcuts="[
                        {
                          label: '今日',
                          value: () => (
                            (form.addTime = $dayjs('00:00:00', 'HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            )),
                            (form.endTime = $dayjs('23:59:59', 'HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            ))
                          ),
                        },
                        {
                          label: '昨日',
                          value: () => (
                            (form.addTime = $dayjs('00:00:00', 'HH:mm:ss')
                              .subtract(1, 'day')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endTime = $dayjs('23:59:59', 'HH:mm:ss')
                              .subtract(1, 'day')
                              .format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '七日',
                          value: () => (
                            (form.addTime = $dayjs('00:00:00', 'HH:mm:ss')
                              .subtract(6, 'day')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endTime = $dayjs().format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '本月',
                          value: () => (
                            (form.addTime = $dayjs('01 00:00:00', 'DD HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            )),
                            (form.endTime = $dayjs().format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '上月',
                          value: () => (
                            (form.addTime = $dayjs(`01 00:00:00`, 'DD HH:mm:ss')
                              .subtract(1, 'month')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endTime = $dayjs()
                              .subtract(1, 'month')
                              .endOf('month')
                              .format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                      ]"
                    />
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item field="endTime" hide-label>
                    <a-date-picker
                      v-model="form.endTime"
                      style="width: 100%"
                      show-time
                      placeholder="请选择结束提现时间"
                      :time-picker-props="{ defaultValue: '12:00:00' }"
                      format="YYYY-MM-DD HH:mm:ss"
                      allow-clear
                      :shortcuts="[
                        {
                          label: '今日',
                          value: () => (
                            (form.addTime = $dayjs('00:00:00', 'HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            )),
                            (form.endTime = $dayjs('23:59:59', 'HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            ))
                          ),
                        },
                        {
                          label: '昨日',
                          value: () => (
                            (form.addTime = $dayjs('00:00:00', 'HH:mm:ss')
                              .subtract(1, 'day')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endTime = $dayjs('23:59:59', 'HH:mm:ss')
                              .subtract(1, 'day')
                              .format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '七日',
                          value: () => (
                            (form.addTime = $dayjs('00:00:00', 'HH:mm:ss')
                              .subtract(6, 'day')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endTime = $dayjs().format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '本月',
                          value: () => (
                            (form.addTime = $dayjs('01 00:00:00', 'DD HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            )),
                            (form.endTime = $dayjs().format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '上月',
                          value: () => (
                            (form.addTime = $dayjs(`01 00:00:00`, 'DD HH:mm:ss')
                              .subtract(1, 'month')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endTime = $dayjs()
                              .subtract(1, 'month')
                              .endOf('month')
                              .format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                      ]"
                    />
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item field="addHandlerTime" hide-label>
                    <a-date-picker
                      v-model="form.addHandlerTime"
                      style="width: 100%"
                      show-time
                      placeholder="请选择开始处理时间"
                      :time-picker-props="{ defaultValue: '12:00:00' }"
                      format="YYYY-MM-DD HH:mm:ss"
                      allow-clear
                      :shortcuts="[
                        {
                          label: '今日',
                          value: () => (
                            (form.addHandlerTime = $dayjs('00:00:00', 'HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            )),
                            (form.endHandlerTime = $dayjs('23:59:59', 'HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            ))
                          ),
                        },
                        {
                          label: '昨日',
                          value: () => (
                            (form.addHandlerTime = $dayjs('00:00:00', 'HH:mm:ss')
                              .subtract(1, 'day')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endHandlerTime = $dayjs('23:59:59', 'HH:mm:ss')
                              .subtract(1, 'day')
                              .format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '七日',
                          value: () => (
                            (form.addHandlerTime = $dayjs('00:00:00', 'HH:mm:ss')
                              .subtract(6, 'day')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endHandlerTime = $dayjs().format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '本月',
                          value: () => (
                            (form.addHandlerTime = $dayjs('01 00:00:00', 'DD HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            )),
                            (form.endHandlerTime = $dayjs().format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '上月',
                          value: () => (
                            (form.addHandlerTime = $dayjs(`01 00:00:00`, 'DD HH:mm:ss')
                              .subtract(1, 'month')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endHandlerTime = $dayjs()
                              .subtract(1, 'month')
                              .endOf('month')
                              .format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                      ]"
                    />
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item field="endHandlerTime" hide-label>
                    <a-date-picker
                      v-model="form.endHandlerTime"
                      style="width: 100%"
                      show-time
                      placeholder="请选择结束处理时间"
                      :time-picker-props="{ defaultValue: '12:00:00' }"
                      format="YYYY-MM-DD HH:mm:ss"
                      allow-clear
                      :shortcuts="[
                        {
                          label: '今日',
                          value: () => (
                            (form.addHandlerTime = $dayjs('00:00:00', 'HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            )),
                            (form.endHandlerTime = $dayjs('23:59:59', 'HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            ))
                          ),
                        },
                        {
                          label: '昨日',
                          value: () => (
                            (form.addHandlerTime = $dayjs('00:00:00', 'HH:mm:ss')
                              .subtract(1, 'day')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endHandlerTime = $dayjs('23:59:59', 'HH:mm:ss')
                              .subtract(1, 'day')
                              .format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '七日',
                          value: () => (
                            (form.addHandlerTime = $dayjs('00:00:00', 'HH:mm:ss')
                              .subtract(6, 'day')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endHandlerTime = $dayjs().format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '本月',
                          value: () => (
                            (form.addHandlerTime = $dayjs('01 00:00:00', 'DD HH:mm:ss').format(
                              'YYYY-MM-DD HH:mm:ss'
                            )),
                            (form.endHandlerTime = $dayjs().format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                        {
                          label: '上月',
                          value: () => (
                            (form.addHandlerTime = $dayjs(`01 00:00:00`, 'DD HH:mm:ss')
                              .subtract(1, 'month')
                              .format('YYYY-MM-DD HH:mm:ss')),
                            (form.endHandlerTime = $dayjs()
                              .subtract(1, 'month')
                              .endOf('month')
                              .format('YYYY-MM-DD HH:mm:ss'))
                          ),
                        },
                      ]"
                    />
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item hide-label>
                    <a-input-group class="width100">
                      <a-input v-model="form.addAmount" placeholder="开始提现金额" />
                      <a-input v-model="form.endAmount" placeholder="结束提现金额" />
                    </a-input-group>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item hide-label>
                    <a-input-group class="width100">
                      <a-input v-model="form.addServiceCharge" placeholder="开始手续费" />
                      <a-input v-model="form.endServiceCharge" placeholder="结束手续费" />
                    </a-input-group>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item hide-label>
                    <a-input-group class="width100">
                      <a-input v-model="form.addWithholdingTax" placeholder="开始代扣税" />
                      <a-input v-model="form.endWithholdingTax" placeholder="结束代扣税" />
                    </a-input-group>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item hide-label>
                    <a-input-group class="width100">
                      <a-input v-model="form.addReceiptBalance" placeholder="开始实际到账" />
                      <a-input v-model="form.endReceiptBalance" placeholder="结束实际到账" />
                    </a-input-group>
                  </a-form-item>
                </a-col>
                <a-col :span="4">
                  <a-form-item field="btns" hide-label>
                    <a-space :size="15">
                      <a-button type="primary" html-type="submit" @click="doRefresh(1)"
                        ><template #icon>
                          <icon-search />
                        </template>
                        <!-- Use the default slot to avoid extra spaces -->
                        <template #default>搜索</template></a-button
                      >
                      <a-button @click="resetSeach"
                        ><template #icon>
                          <icon-sync theme="outline" size="14" />
                        </template>
                        <!-- Use the default slot to avoid extra spaces -->
                        <template #default>重置</template></a-button
                      >
                    </a-space>
                  </a-form-item>
                </a-col>
              </a-row>
            </a-form>
          </template>
        </TableHeader>
      </template>
      <template #table-config>
        <a-space :size="15">
          <a-button type="outline" status="warning" @click="exportLists" :loading="loading">
            <!-- Use the default slot to avoid extra spaces -->
            <template #default>导出</template>
          </a-button>
          <a-button type="outline" status="warning" @click="open">
            <!-- Use the default slot to avoid extra spaces -->
            <template #default>发起提现</template>
          </a-button>
        </a-space>
        <a-space :size="15">
          <TableConfig
            @update-border="onUpdateBorder"
            @update-striped="onUpdateStriped"
            @refresh="doRefresh"
          />
        </a-space>
      </template>
      <template #default>
        <a-table
          :stripe="(tables.striped as boolean)"
          :loading="tableLoading"
          :data="table.dataList"
          :pagination="false"
          :column-resizable="true"
          :rowKey="rowKey"
          :columns="tableColumns.list"
          table-layout-fixed
          :bordered="{ wrapper: true, cell: tables.bordered }"
          :scroll="{ x: 1500 }"
          :scrollbar="{ type: 'track', outerClass: '', outerStyle: '' }"
        >
          <template #columns>
            <a-table-column
              v-for="item of tableColumns.list"
              :key="item.key"
              align="left"
              :width="item.width"
              :ellipsis="true"
              :tooltip="true"
              :title="(item.title as string)"
              :data-index="(item.key as string)"
              :fixed="item.fixed"
            >
              <template v-if="item.key === 'type'" #cell="{ record }">
                <span v-if="record.type == 0">支付宝</span>
                <span v-if="record.type == 1">微信</span>
                <span v-if="record.type == 2">银行卡</span>
              </template>
              <template v-else-if="item.key === 'other'" #cell="{ record }">
                <span v-if="record.type == 2">{{ record.information }}</span>
                <a-image
                  v-else-if="record.information"
                  style="width: 40px; height: 40px"
                  :src="record.information"
                />
                <span v-else>- - -</span>
              </template>
              <template v-else-if="item.key === 'state'" #cell="{ record }">
                <a-tag v-if="record.state === 0">等待审核</a-tag>
                <a-tag color="gold" v-else-if="record.state === 1">正在审核</a-tag>
                <a-tag color="blue" v-if="record.state === 2">通过审核</a-tag>
                <a-tag color="red" v-else-if="record.state === 3">审核驳回</a-tag>
              </template>
              <template v-else-if="item.key === 'payTemplateId'" #cell="{ record }">
                <span v-if="!record.handlerTime">---</span>
                <span v-else>
                  <span v-if="record.payTemplateId">自动打款</span>
                  <span v-else>手动打款</span>
                </span>
              </template>
              <template v-else-if="item.key === 'userRemarks'" #cell="{ record }">
                <span v-if="record.userRemarks">{{ record.userRemarks }}</span>
                <span v-else>- - -</span>
              </template>
              <template v-else-if="item.key === 'handlerTime'" #cell="{ record }">
                <span v-if="record.handlerTime">{{ record.handlerTime }}</span>
                <span v-else>- - -</span>
              </template>
              <template v-else-if="item.key === 'adminRemarks'" #cell="{ record }">
                <span v-if="record.adminRemarks">{{ record.adminRemarks }}</span>
                <span v-else>- - -</span>
              </template>
            </a-table-column>
          </template>
        </a-table>
      </template>
      <template #footer>
        <TableFooter ref="tableFooterRef" :pagination="pagination" />
      </template>
    </TableBody>
    <a-modal
      :mask-closable="false"
      @before-close="cancel"
      v-model:visible="showV"
      title="申请提现"
      width="700px"
      title-align="start"
    >
      <a-form ref="showRef" :auto-label-width="true" :model="showForm">
        <a-form-item label="提现途径" field="withdrawalVerification">
          <a-radio-group class="radio-bcg" v-model="showForm.type">
            <a-radio v-for="item in lists" :key="item.value" :value="item.value">
              <template #radio="{ checked }">
                <div style="display: flex" :class="{ 'custom-radio-card-checked': checked }">
                  <div className="custom-radio-card-mask">
                    <div className="custom-radio-card-mask-dot"></div> </div
                  ><div className="custom-radio-card-title">{{ item.name }}</div>
                </div>
              </template>
            </a-radio>
          </a-radio-group>
        </a-form-item>
        <a-form-item
          label="提现金额"
          :rules="[{ required: true, message: '提现金额不能为空' }]"
          :validate-trigger="['change', 'input']"
          field="amount"
          asterisk-position="end"
        >
          <a-input-number :min="1" placeholder="请输入提现金额" v-model.trim="showForm.amount" />
        </a-form-item>
        <a-form-item
          v-if="WithdrawalForm.withdrawalVerification == true"
          label="验证码"
          :rules="[
            {
              required: true,
              message: '验证码不能为空',
            },
          ]"
          :validate-trigger="['change', 'input']"
          field="code"
          asterisk-position="end"
        >
          <a-input placeholder="请输入验证码" v-model.trim="showForm.code" search-button>
            <template #append>
              <a-button
                type="primary"
                style="height: 25px; width: 100%"
                :loading="sendCode.disable"
                @click="smsFns"
                >{{ sendCode.codeText }}</a-button
              >
            </template>
          </a-input>
        </a-form-item>
        <a-form-item label="预估到账" v-if="showForm.amount > 0" field="text">
          <a-input placeholder="请输入预估到账" readonly v-model.trim="showForm.text" search-button>
            <template #append>
              <a-button type="text" @click="yugu">预估到账</a-button>
            </template>
          </a-input>
        </a-form-item>
        <a-form-item
          label="提现规则"
          v-if="
            WithdrawalForm.addWithdrawalDate ||
            WithdrawalForm.withdrawalDay ||
            WithdrawalForm.addAmount ||
            WithdrawalForm.withholdingTax ||
            WithdrawalForm.withdrawalServiceChargeMode ||
            WithdrawalForm.reserveBalance ||
            WithdrawalForm.integerLimit == 0 ||
            WithdrawalForm.integerLimit == 1 ||
            WithdrawalForm.integerLimit == 2 ||
            WithdrawalForm.integerLimit == 3 ||
            WithdrawalForm.integerLimit == 4
          "
        >
          <div
            style="
              background-color: var(--color-fill-2);
              width: 100%;
              line-height: 32px;
              border-radius: 5px;
              text-align: left;
              padding: 5px 10px;
            "
          >
            <div v-if="WithdrawalForm.addWithdrawalDate"
              >日期限制：{{ WithdrawalForm.addWithdrawalDate }}号-{{
                WithdrawalForm.endWithdrawalDate
              }}号可发起提现</div
            >
            <div v-if="WithdrawalForm.withdrawalDay"
              >时间限制：每{{ WithdrawalForm.withdrawalDay }}天可提现{{
                WithdrawalForm.withdrawalFrequency
              }}次</div
            >
            <div v-if="WithdrawalForm.addAmount"
              >金额限制：提现金额必须在{{ WithdrawalForm.addAmount }}元-{{
                WithdrawalForm.endAmount
              }}元之间</div
            >
            <div
              v-if="
                WithdrawalForm.integerLimit == 0 ||
                WithdrawalForm.integerLimit == 1 ||
                WithdrawalForm.integerLimit == 2 ||
                WithdrawalForm.integerLimit == 3 ||
                WithdrawalForm.integerLimit == 4
              "
              >整数限制：提现金额需要为
              <span v-if="WithdrawalForm.integerLimit == 0">整元</span>
              <span v-if="WithdrawalForm.integerLimit == 1">整十</span>
              <span v-if="WithdrawalForm.integerLimit == 2">整百</span>
              <span v-if="WithdrawalForm.integerLimit == 3">整千</span>
              <span v-if="WithdrawalForm.integerLimit == 4">整万</span>
            </div>
            <div v-if="WithdrawalForm.withholdingTax"
              >代扣税：每次提现代扣税{{ WithdrawalForm.withholdingTax }}%</div
            >
            <div v-if="WithdrawalForm.withdrawalServiceChargeMode"
              >提现手续费：每次提现手续费<span
                v-if="WithdrawalForm.withdrawalServiceChargeMode == 0"
                >{{ WithdrawalForm.withdrawalServiceChargeFixedAmount }}元</span
              >
              <span v-if="WithdrawalForm.withdrawalServiceChargeMode == 1"
                >{{ WithdrawalForm.withdrawalServiceChargeRate }}%</span
              >
              <span v-if="WithdrawalForm.withdrawalServiceChargeMode == 2"
                >{{ WithdrawalForm.withdrawalServiceChargeFixedAmount }}元+{{
                  WithdrawalForm.withdrawalServiceChargeRate
                }}%</span
              ></div
            >
            <div v-if="WithdrawalForm.reserveBalance"
              >预留余额：提现后余额必须在{{ WithdrawalForm.reserveBalance }}元以上</div
            >
          </div>
        </a-form-item>
        <a-form-item label="提现备注" field="remarks">
          <a-input placeholder="请输入提现备注" v-model.trim="showForm.remarks"
        /></a-form-item>
      </a-form>
      <template #footer>
        <a-space>
          <a-button @click="cancel">取消</a-button>
          <a-button type="primary" @click="OK">确定</a-button>
        </a-space>
      </template>
    </a-modal>
  </div>
</template>

<script lang="ts" setup>
  import { formpost, get } from '@/api/http'
  import {
    withdrawalGetexport,
    withdrawalCode,
    withdrawalApply,
    withdrawalGetlist,
  } from '@/api/user'
  import useCommonStore from '@/store/modules/common'
  import { withdrawal } from '@/api/url'
  import { usePagination, useRowKey, useTable, useTableHeight } from '@/hooks/table'
  import { getCurrentInstance, onMounted, reactive, ref } from 'vue'
  import { Message } from '@arco-design/web-vue'

  const form = reactive({
    userId: '', //            客户ID
    payTemplateId: '', //            支付模板ID
    type: '', //            提现类型 0支付宝 1微信 2银行卡
    manual: '', //           true 手动处理 false自动打款
    outTradeNo: '', //           提现订单号
    transactionNo: '', //           交易订单号
    name: '', //           收款人姓名
    accountNumber: '', //   收款账号
    states: '', //          提现状态 0等待 1正在 2通过 3驳回
    ip: '', //           ip
    addTime: '', //         申请提现时间开始
    endTime: '', //         申请提现时间结束
    addHandlerTime: '', //    处理提现时间开始
    endHandlerTime: '', //   处理提现时间结束
    addAmount: '', //   开始提现金额
    endAmount: '', //   结束提现金额
    addServiceCharge: '', //  手续费开始
    endServiceCharge: '', // 手续费结束
    addWithholdingTax: '', // 代扣税开始
    endWithholdingTax: '', // 代扣税结束
    addReceiptBalance: '', // 实际到账金额开始
    endReceiptBalance: '', // 实际到账结束
  })
  const tables = reactive({
    tableLoading: false,
    bordered: false,
    striped: false,
    expand: [1],
    isExpand: false,
  })
  const lists: any = ref([])
  const list = ref([
    {
      value: 1,
      name: '微信',
    },
    {
      value: 0,
      name: '支付宝',
    },
    {
      value: 2,
      name: '银行卡',
    },
  ])
  const showV = ref(false)
  const showForm = ref({
    type: '', // 提现途径 0支付宝 1微信 2银行卡
    amount: '', // 提现金额
    code: '', //短信验证码,
    text: '暂未预估提现',
    remarks: '',
  })
  const sendCode = reactive({
    codeText: '发送验证码',
    disable: false,
  })
  const showRef = ref()
  const userCommon = useCommonStore()
  const WithdrawalForm: any = ref({})
  const table = useTable()
  const rowKey = useRowKey('id')
  const pagination = usePagination(doRefresh)
  const tableColumns: any = reactive({
    list: [
      {
        title: '提现姓名',
        key: 'name',
        dataIndex: 'name',
        checked: true,
        width: 160,
      },
      {
        title: '提现账号',
        key: 'accountNumber',
        dataIndex: 'accountNumber',
        checked: true,
        width: 220,
      },
      {
        title: '其他信息',
        key: 'other',
        dataIndex: 'other',
        checked: true,
        width: 160,
      },
      {
        title: '提现途径',
        key: 'type',
        dataIndex: 'type',
        checked: true,
        width: 90,
      },
      {
        title: '提现金额',
        key: 'amount',
        dataIndex: 'amount',
        checked: true,
        width: 90,
      },
      {
        title: '手续费',
        key: 'serviceCharge',
        dataIndex: 'serviceCharge',
        checked: true,
        width: 90,
      },
      {
        title: '代扣税',
        key: 'withholdingTax',
        dataIndex: 'withholdingTax',
        checked: true,
        width: 90,
      },
      {
        title: '实际到账',
        key: 'receiptBalance',
        dataIndex: 'receiptBalance',
        checked: true,
        width: 90,
      },
      {
        title: '打款方式',
        key: 'payTemplateId',
        dataIndex: 'payTemplateId',
        checked: true,
        width: 90,
      },
      {
        title: '提现状态',
        key: 'state',
        dataIndex: 'state',
        checked: true,
        width: 120,
      },
      {
        title: '提现时间',
        key: 'createTime',
        dataIndex: 'createTime',
        checked: true,
        width: 190,
      },
      {
        title: '处理时间',
        key: 'handlerTime',
        dataIndex: 'handlerTime',
        checked: true,
        width: 190,
      },
      {
        title: '客户备注',
        key: 'userRemarks',
        dataIndex: 'userRemarks',
        checked: true,
        width: 190,
      },
      {
        title: '处理备注',
        key: 'adminRemarks',
        dataIndex: 'adminRemarks',
        checked: true,
        width: 190,
      },
    ],
  })

  const tableLoading = ref(true)
  const loading = ref(false)
  const times = ref()
  const exportLists = () => {
    loading.value = true
    userCommon.downLoads(withdrawalGetexport, form, '提现列表').then(() => {
      loading.value = false
    })
  }
  //提交申请
  const OK = () => {
    showRef.value.validate((error: any) => {
      if (!error) {
        formpost({
          url: withdrawalApply,
          data: { ...showForm.value },
        }).then((res) => {
          if (res.code == 0) {
            Message.success(res.msg)
            doRefresh()
            cancel()
          }
        })
      }
    })
  }
  const open = () => {
    showV.value = true
    getWithdrawal()
  }
  const cancel = () => {
    showRef.value?.resetFields()
    showV.value = false
  }
  //提现商户
  const smsFns = () => {
    get({
      url: withdrawalCode,
      data: {},
    }).then((res) => {
      if (res.code == 0) {
        Message.success(res.msg)
        let time = 60
        times.value = setInterval(() => {
          sendCode.disable = true
          time--
          sendCode.codeText = time + 's重新发送'
          if (time <= 0) {
            clearInterval(times.value)
            sendCode.codeText = '获取验证码'
            sendCode.disable = false
          }
        }, 1000)
      }
    })
  }

  function getWithdrawal() {
    get({
      url: withdrawal,
      data: {},
    }).then((res) => {
      lists.value = []
      res.data.withdrawalRoutes.forEach((item: any) => {
        list.value.forEach((items) => {
          if (item == items.value) {
            lists.value.push(items)
          }
        })
      })
      showForm.value.type = res.data.withdrawalRoutes[0]
      WithdrawalForm.value = res.data
      console.log(WithdrawalForm.value)
    })
  }
  const yugu = () => {
    let fei = 0
    if (WithdrawalForm.value.withdrawalServiceChargeMode == 0) {
      console.log('1')
      fei = WithdrawalForm.value.withdrawalServiceChargeFixedAmount
    } else if (WithdrawalForm.value.withdrawalServiceChargeMode == 1) {
      fei =
        Math.floor(
          ((showForm.value.amount * WithdrawalForm.value.withdrawalServiceChargeRate) / 100) * 100
        ) / 100
      console.log('2')
    } else if (WithdrawalForm.value.withdrawalServiceChargeMode == 2) {
      console.log(WithdrawalForm.value.withdrawalServiceChargeRate)
      console.log(showForm.value.amount * WithdrawalForm.value.withdrawalServiceChargeRate)
      fei =
        WithdrawalForm.value.withdrawalServiceChargeFixedAmount +
        Math.floor(
          ((showForm.value.amount * WithdrawalForm.value.withdrawalServiceChargeRate) / 100) * 100
        ) /
          100
    }
    let dai = 0
    if (WithdrawalForm.value.withholdingTax) {
      dai =
        Math.floor(((showForm.value.amount * WithdrawalForm.value.withholdingTax) / 100) * 100) /
        100
    }
    showForm.value.text =
      '实际到账：' +
      Math.floor((showForm.value.amount - fei - dai) * 100) / 100 +
      '元，代扣税' +
      dai +
      '元，提现手续费' +
      fei +
      '元'
  }
  function doRefresh(value?: number) {
    // eslint-disable-next-line prettier/prettier
    tableLoading.value = true
    if (value) {
      pagination.page = value
    }
    get({
      url: withdrawalGetlist,
      data: {
        page: pagination.page,
        size: pagination.pageSize,
        ...form,
      },
    })
      .then((res) => {
        tableLoading.value = false
        table.handleSuccess(res.data.list)
        pagination.setTotalSize((res.data as any).totalSize)
      })
      .catch(console.log)
  }

  function onUpdateBorder(isBordered: boolean) {
    table.bordered.value = isBordered
  }
  function onUpdateStriped(isStriped: boolean) {
    table.striped.value = isStriped
  }
  const serchForm = ref()
  const resetSeach = () => {
    serchForm.value?.resetFields()
    form.addAmount = '' //   开始提现金额
    form.endAmount = '' //   结束提现金额
    form.addServiceCharge = '' //  手续费开始
    form.endServiceCharge = '' // 手续费结束
    form.addWithholdingTax = '' // 代扣税开始
    form.endWithholdingTax = '' // 代扣税结束
    form.addReceiptBalance = '' // 实际到账金额开始
    form.endReceiptBalance = '' // 实际到账结束
    doRefresh(1)
  }
  onMounted(async () => {
    table.tableHeight.value = await useTableHeight(getCurrentInstance())
    doRefresh()
  })
</script>
<style lang="less" scoped>
  :deep(.arco-modal) {
    .arco-modal-footer {
      text-align: right !important;
    }
  }
  :deep(.arco-modal-header .arco-modal-title) {
    display: flex;
    justify-content: flex-start !important;
  }
</style>
